<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="cn.edu.ecut.se2024.model.supplier_mgmt.Supplier" %>
<%@ page import="cn.edu.ecut.se2024.model.supplier_mgmt.SupplierContact" %>
<%@ page import="cn.edu.ecut.se2024.model.supplier_mgmt.SupplierAddress" %>
<%@ page import="cn.edu.ecut.se2024.controller.SupplierMgmtController" %>

<style type="text/css">
	input[type="text"] {
		border: 2px solid #CCCCCC;
		border-radius: 8px;  /* 圆角 */
		height: 25px;
	}
	.button {
		border: none;
		border-radius: 5px;  /* 按钮圆角 */
		transition-duration: 0.3s;  /* 过渡效果持续时间 */
		font-size: 16px;
		color: #FFFFFF;
		background-color: #4B9E5F;
		width: 50px;
		height: 40px;
	}
	.button:hover {
		background-color: #4682B4;
	}
	.delete-button {
		background-color: #FF0000;
	}
	.delete-button:hover {
		background-color: #DC143C;
	}
	.button-table {
		border-collapse: collapse;
		border-spacing: 5px;
	}
	.button-table td {
		text-align: center;
		vertical-align: center;
		padding: 5px;
	}
	.table-div {
		width: 950px;
		max-height: 500px;
		overflow-x: auto;
		overflow-y: auto;
	}
	.table {
		border-collapse: collapse;
		border-spacing: 0px;
	}
	.table input[type="checkbox"] {
		transform: scale(1.5);
	}
	.table tbody tr:hover{
		background-color: #DCDCDC;
	}
	.table th, .table td {
		white-space: nowrap;
		text-align: center;
		vertical-align: center;
		padding: 8px;
		border: 2px solid #DDDDDD;
	}
	.table th {
		background-color: #F9F9F9;
		position: sticky;  /* 固定表头 */
		top: 0;
		z-index: 1;
	}
</style>

<%	// 获取用户权力
	String user_power = (String)request.getSession().getAttribute(SupplierMgmtController.SUPPLIER_MGMT_POWER);
	// 判断用户是否有管理权力
	boolean have_mgmt_power = false;
	if (user_power != null && user_power.equals(SupplierMgmtController.SUPPLIER_MGMT_POWER_MGMT)) {
		have_mgmt_power = true;
	}
	// 获取供应商名称
	String supplier_name = (String)request.getAttribute(SupplierMgmtController.SUPPLIER_MGMT_SUPPLIER_NAME);
	// 判断是否有供应商名称
	boolean have_supplier_name = false;
	if (supplier_name != null) {
		have_supplier_name = true;
	}
	// 获取供应商列表
	ArrayList<Supplier> supplierlist = (ArrayList<Supplier>)request.getAttribute(SupplierMgmtController.SUPPLIER_MGMT_SUPPLIERLIST);
%>

<!-- 操作按钮表格 -->
<table class="button-table">
	<tr>
		<td><input type="button" class="button" name="refresh" value="刷新" onclick="refreshSupplier()"></td>
		<td><input type="button" class="button" name="see" value="查看" onclick="seeSupplier()"></td>
<%	if (have_mgmt_power) {
	%>
		<td><input type="button" class="button" name="toAdd" value="增加" onclick="toAddSupplier()"></td>
		<td><input type="button" class="button" name="toUpdate" value="修改" onclick="toUpdateSupplier()"></td>
		<td><input type="button" class="button delete-button" name="delete" value="删除" onclick="deleteSupplier()"></td>
<%	}
	%>
		<td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
		<!-- 查找供应商名称表单 -->
		<td><form id="searchSupplierForm" action="suppliermgmt.searchSupplier" method="post">
			<input id="supplier_name" type="text" name="supplier_name" value="<%=have_supplier_name ? supplier_name : "" %>" placeholder="请输入需要查找的供应商名称！" style="width: 200px;">
			<input type="button" class="button" name="search" value="查找" onclick="searchSupplier()">
		</form></td>
	</tr>
</table>

<!-- 供应商信息表格 -->
<div class="table-div">
	<table id="SupplierTable" class="table">
		<!-- 表头 -->
		<thead>
			<tr>
				<th>选择</th>
				<th>供应商ID</th><th>名称</th><th>类型</th><th>银行账户</th>
				<th>默认地址</th><th>默认联系人姓名</th><th>默认联系人电话</th>
			</tr>
		</thead>
		
		<!-- 供应商信息 -->
		<tbody>
		<%	if (supplierlist == null || supplierlist.isEmpty()) {
			%>
					<tr><td colspan="8">暂时没有供应商数据</td></tr>
		<%	}
			else {
				for (Supplier supplier: supplierlist) {
			%>
					<tr>
							<td><input type="checkbox" onclick="checkOnlyOne(this,<%=supplier.getId() %>)"></td>
							<td><%=supplier.getId() %></td>
							<td><%=supplier.getName() %></td>
							<td><%=supplier.getType() %></td>
							<td><%=supplier.getBank() %></td>
		<%
					for(SupplierAddress sa: supplier.getAddress()) {
						if(sa.isDefaults()) {
			%>
							<td><%=sa.getAddress() %></td>
		<%
							break;
						}
					}
					for(SupplierContact sc: supplier.getContact()) {
						if(sc.isDefaults()) {
			%>
							<td><%=sc.getName() %></td>
							<td><%=sc.getPhone() %></td>
		<%
							break;
						}
					}                               
			%>             
					</tr>
		<%		}
			}
			%>
		</tbody>
	</table>
</div>

<!-- 隐藏的“刷新”表单 -->
<form id="refreshSupplierForm" action="<%=have_mgmt_power ? "suppliermgmt.mgmt" : "suppliermgmt.see" %>" method="post" style="display: none;"></form>
<!-- 隐藏的“增加”提交表单 -->
<form id="toAddSupplierForm" action="suppliermgmt.toAddSupplier" method="post" style="display: none;"></form>
<!-- 隐藏的“查看、修改、删除”提交表单 -->
<form id="actionSupplierForm" action="" method="post" style="display: none;">
	<input id="supplier_id" type="hidden" name="supplier_id" value="">
</form>

<script>
	var selectedId = null;  // 选中行的供应商ID
	var lastCheckbox = null;  // 上一个选中的复选框
	
	// 保证最多只能选中表格的一行
	function checkOnlyOne(checkbox,id) {
		if (checkbox.checked) {
			// 取消选中上一个选中的复选框
			if(lastCheckbox !== null) {
				lastCheckbox.checked = false;
			}
			
			selectedId = id;
			lastCheckbox = checkbox;
		}
		else {
			selectedId = null;
			lastCheckbox = null;
		}
	}
	// 判断是否选中一行
	function SelectOne() {
		if (selectedId === null) {
			alert("请选择一个供应商！");
			return false;
		}
		else {
			// 设置供应商ID
			document.getElementById("supplier_id").value = selectedId;
			return true;
		}
	}
	// 发起查找供应商名称请求
	function searchSupplier() {
		// 去除前后空白字符
		document.getElementById("supplier_name").value = document.getElementById("supplier_name").value.trim();
		var supplier_name = document.getElementById("supplier_name").value;
		
		if (supplier_name === "") {
			alert("请输入需要查找的供应商名称！");
		}
		else {
			document.getElementById("searchSupplierForm").submit();
		}
	}
	// 发起刷新请求
	function refreshSupplier() {
		document.getElementById("refreshSupplierForm").submit();
	}
	// 发起查看供应商请求
	function seeSupplier() {
		if (SelectOne()) {
			// 设置隐藏表单动作
			document.getElementById("actionSupplierForm").action = "suppliermgmt.seeSupplier";
			document.getElementById("actionSupplierForm").submit();
		}
	}
	// 发起增加供应商请求
	function toAddSupplier() {
		document.getElementById("toAddSupplierForm").submit();
	}
	// 发起修改供应商请求
	function toUpdateSupplier() {
		if (SelectOne()) {
			// 设置隐藏表单动作
			document.getElementById("actionSupplierForm").action = "suppliermgmt.toUpdateSupplier";
			document.getElementById("actionSupplierForm").submit();
		}
	}
	// 发起删除供应商请求
	function deleteSupplier() {
		if (SelectOne() && confirm("确定要删除这条供应商数据吗？")) {
			// 设置隐藏表单动作
			document.getElementById("actionSupplierForm").action = "suppliermgmt.deleteSupplier";
			document.getElementById("actionSupplierForm").submit();
		}
	}
	
	// 为供应商表格添加监听器以实现点击表格行勾选或取消勾选该行复选框
	var supplier_table = document.getElementById("SupplierTable");
	supplier_table.addEventListener("click", function(event) {
		var target = event.target;
		if (target.tagName.toLowerCase() === "td") {
			var row = target.parentNode;
			// 查找该行内的复选框
			var checkbox = row.querySelector("input[type='checkbox']");
			if (checkbox) {
				checkbox.click();
			}
		}
	});
</script>
